<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>03_分区元素</title>
</head>
<body>
<!--1.行内分区元素 span 没有额外的文字效果 不会换行 只是单独将本行的一部分选中-->
大家中午好！欢迎大家进入java方向的<span style="color:red">第三阶段</span>进行学习！

今天是<span style="color:blue;">2025年8月20日</span>,星期<span style="color:green;">三</span>，天气<span style="color:orange;">晴</span>
<hr>
<!--2.块级分区元素 会换行 独占一行-->
<div>我是块级元素</div>
<div>我是块级元素</div>
<div>我是块级元素</div>
<hr>

<!--3.使用旧版实现-->
<div class="header">我是头部 </div>
<div class="nav">我是导航栏</div>
<div class="main">我是主体</div>
<div class="footer">我是尾部</div>
<hr>

<!--4.使用新版实现-->
<header>我是头部</header>
<nav>我是导航栏</nav>
<main>我是主体</main>
<footer>我是尾部</footer>


</body>
</html>